<%@ page language="java" contentType="text/html; charset=UTF-8"  pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>login</title>
    <c:set value="${pageContext.request.contextPath}" var="path" scope="page"/>
	<link rel="stylesheet" href="${path}/static/style/login.css">
	<script src="${path}/static/script/jQuery 3.5.1.min.js"></script>
</head>

<body>
	<p class="tip">Click on button in image container</p>
	<div class="cont">
	    <div class="form sign-in">
	        <h2>Welcome back,</h2>
	        <label>
	            <span>Username</span>
	            <input type="text" id="loginname" />
	        </label>
	        <label>
	            <span>Password</span>
	            <input type="password" id="loginpwd" />
	        </label>
	        <p class="forgot-pass">Forgot password?</p>
	        <button type="button" class="submit" id="login-btn">Sign In</button>
	        <button type="button" class="fb-btn"><a href="https://gitee.com/is666a">Connect with <span>facebook</span></a></button>
	    </div>
	    <div class="sub-cont">
	        <div class="img">
	            <div class="img__text m--up">
	                <h2>New here?</h2>
	                <p>Sign up and discover great amount of new opportunities!</p>
	            </div>
	            <div class="img__text m--in">
	                <h2>One of us?</h2>
	                <p>If you already has an account, just sign in. We've missed you!</p>
	            </div>
	            <div class="img__btn">
	                <span class="m--up">Sign Up</span>
	                <span class="m--in">Sign In</span>
	            </div>
	        </div>
	        <div class="form sign-up">
	            <h2>Time to feel like home,</h2>
	            <label>
	                <span>Name</span>
	                <input type="text" id="regname" />
	            </label>
	            <label>
	                <span>Email</span>
	                <input type="email" id="regemail" />
	            </label>
	            <label>
	                <span>Password</span>
	                <input type="password" id="regpwd" />
	            </label>
	            <button type="button" class="submit" id="reg-btn">Sign Up</button>
	            <button type="button" class="fb-btn"><a href="https://gitee.com/is666a">Join with <span>facebook</span></a></button>
	        </div>
	    </div>
	</div>
	
	<a href="https://dribbble.com/shots/3306190-Login-Registration-form" target="_blank" class="icon-link">
	    <img src="http://icons.iconarchive.com/icons/uiconstock/socialmedia/256/Dribbble-icon.png">
	</a>
	<a href="https://twitter.com/NikolayTalanov" target="_blank" class="icon-link icon-link--twitter">
	    <img src="https://cdn1.iconfinder.com/data/icons/logotypes/32/twitter-128.png">
	</a>
	
    <script src="${path}/static/script/login.js"></script>
</body>

</html>